<!--
 * @Author: FanWeiHua
 * @Date: 2021-07-26 15:40:10
 * @LastEditTime: 2021-07-30 14:39:51
 * @Description: App
-->
<template>
  <n-config-provider :theme="theme === 'darkTheme' ? darkTheme : lightTheme" :locale="zhCN" :date-locale="dateZhCN">
    <router-view></router-view>
  </n-config-provider>
</template>
<script>
import { computed } from 'vue';
import { useStore } from 'vuex';
import i18n from './common/i18n.js';
import { zhCN, dateZhCN, NConfigProvider, darkTheme, lightTheme } from 'naive-ui';

/**
 * 主题切换demo
 */
let className = 'theme-sky';
setInterval(() => {
  if (className === 'theme-sky') {
    i18n.global.locale.value = 'en';
    className = 'theme-red';
  } else {
    className = 'theme-sky';
    i18n.global.locale.value = 'zh';
  }
  document.body.setAttribute('class', className);
}, 2000);
export default {
  components: {
    NConfigProvider
  },
  setup() {
    const store = useStore();
    return {
      theme: computed(() => store.state.increment.theme),
      zhCN,
      dateZhCN,
      darkTheme,
      lightTheme
    };
  }
};
</script>
<style lang="less">
@import './index.less';
</style>
